// .box {
//   // width: 194px;
//   // height: 42px;
//   // background-color: #303033;
//   // padding: 10px;
//   color: var(--font-1);
//   border: 1px solid var(--bg-4);

//   .collapse {
//     border: none;
//     background-color: var(--bg-5);
//     width: 220px;

//     .show-result {
//       background-color: var(--bg-3);
//       display: flex;
//       justify-content: flex-end;
//       padding: 0 5px 5px 0;
//       .apipost-btn {
//         // margin-left: auto;
//       }
//     }

//     // height: 42px;
//     .collapse-body {
//       border: none !important;
//       background-color: var(--bg-3);
//       width: 100%;
//       padding: 16px !important;

//       .common-flex {
//         display: flex;
//         align-items: center;
//         justify-content: space-between;
//         margin-top: 10px;

//         span {
//           white-space: nowrap;
//         }

//         .apipost-input-inner-wrapper {
//           // width: 124px;
//           height: 24px;
//           margin-left: 4px;
//         }
//       }

//       .api-weight {
//         display: flex;
//         align-items: center;
//         justify-content: space-between;
//         padding-bottom: 8px;
//         border-bottom: 1px solid var(--bg-4);

//         span {
//           white-space: nowrap;
//         }

//         .apipost-input-inner-wrapper {
//           // width: 124px;
//           height: 24px;
//           margin-left: 4px;
//         }
//       }

//       .apipost-select {
//         border: none;
//         width: 100%;
//         // margin-top: 10px;
//         background-color: var(--bg-3);
//       }

//       .config-line {
//         border: 1px solid var(--bg-4);
//         height: 24px;
//         width: 172px;
//         margin-left: 4px;
//       }
//     }
//   }

//   svg {
//     width: 16px;
//     height: 16px;
//     fill: var(--font-1);
//   }

//   .box-item {
//     display: flex;
//     justify-content: space-between;
//     align-items: center;
//     width: 100%;
//     height: 44px;
//     padding: 10px;
//     position: relative;
//     color: var(--font-1);

//     .drag-content {
//       position: absolute;
//       top: 0;
//       height: 38px;
//       left: 0;
//       width: 70%;
//       // background-color: #f00;
//     }

//     &-left {
//       display: flex;
//       align-items: center;

//       .name {
//         margin-left: 4px;
//         max-width: 124px;
//         overflow: hidden;
//         white-space: nowrap;
//         text-overflow: ellipsis;
//       }

//       .default {
//         width: 12px !important;
//         height: 12px !important;
//       }

//       .default,
//       .success,
//       .failed {
//         margin-left: 4px;
//       }

//       .success {
//         fill: #0f0 !important;
//       }

//       .failed {
//         fill: #f00 !important;
//       }
//     }

//     &-right {
//       display: flex;

//       .drop-down {
//         padding: 3px;

//         svg {
//           width: 9px;
//           height: 9px;
//         }
//       }

//       .apipost-btn {
//         // width: 18px;
//         // height: 18px;
//         margin-left: 15px;
//       }

//       .drop-down:hover {
//         background: var(--select);
//         border-radius: 3px;
//         // transform: matrix(1, 0, 0, -1, 0, 0);
//       }

//       .more-svg {
//         margin-left: 15px;
//         cursor: pointer;
//       }
//     }
//   }

//   .my_handle {
//     width: 12px;
//     height: 12px;
//     z-index: 10;
//   }
//   .my_handle:hover {
//     border-color: var(--theme-color);
//     background-color: var(--font-1);
//   }
// }

// .diybox {
//   display: flex;
//   align-items: center;
//   padding: 0 10px;

//   .add {
//     width: 40px;
//     display: flex;
//     justify-content: center;
//     align-items: center;
//     cursor: pointer;
//     background: #409eff;
//     color: var(--font-1);
//     font-size: 12px;
//   }

//   .input {
//     flex: 1;
//     min-width: 0;
//     outline: none;
//     height: 24px;
//     border: 1px solid #dcdfe6;
//     background: var(--bg-3);
//     border: 1px solid var(--bg-4);
//     width: 120px;
//     font-size: 12px;
//     color: var(--font-1);
//   }
//   .apipost-btn {
//     height: 30px;
//     margin-left: 10px;
//     background-color: var(--theme-color);
//     color: var(--common-white);
//   }
// }

// .apipost-dropdown {
//   z-index: 9999;
//   .drop-content {
//     display: flex;
//     flex-direction: column;
//     padding: 0 5px;

//     p {
//       flex: 1;
//       margin: 10px 0;
//       cursor: pointer;
//     }

//     p:hover {
//       color: var(--font-1);
//     }
//   }
// }

// .box:hover {
//   border: 1px solid var(--font-2);
// }


// .selectBox {
//   border: 1px solid var(--theme-color) !important;
// }

// .white-run-color {
//   color: #fff !important;

//   svg {
//     fill: #fff !important;
//   }
// }